﻿@model IEnumerable<GUI.Models.AccountAuthorModel>
@{
 Layout="~/Views/Shared/_LayoutAdmin.cshtml";
}
<script src="~/Scripts/handlebars-v2.0.0.js"></script>



@section row{

     <!-- Small boxes (Stat box) -->
                    <div class="row">
                        <div class="col-lg-3 col-xs-6">
                            <!-- small box -->
                            <div class="small-box bg-aqua">
                                <div class="inner">
                                    <h3>
                                        150
                                    </h3>
                                    <p>
                                        New Orders
                                    </p>
                                </div>
                                <div class="icon">
                                    <i class="ion ion-bag"></i>
                                </div>
                                <a href="#" class="small-box-footer">
                                    More info <i class="fa fa-arrow-circle-right"></i>
                                </a>
                            </div>
                        </div><!-- ./col -->
                        <div class="col-lg-3 col-xs-6">
                            <!-- small box -->
                            <div class="small-box bg-green">
                                <div class="inner">
                                    <h3>
                                        53<sup style="font-size: 20px">%</sup>
                                    </h3>
                                    <p>
                                        Bounce Rate
                                    </p>
                                </div>
                                <div class="icon">
                                    <i class="ion ion-stats-bars"></i>
                                </div>
                                <a href="#" class="small-box-footer">
                                    More info <i class="fa fa-arrow-circle-right"></i>
                                </a>
                            </div>
                        </div><!-- ./col -->
                        <div class="col-lg-3 col-xs-6">
                            <!-- small box -->
                            <div class="small-box bg-yellow">
                                <div class="inner">
                                    <h3>
                                        44
                                    </h3>
                                    <p>
                                        User Registrations
                                    </p>
                                </div>
                                <div class="icon">
                                    <i class="ion ion-person-add"></i>
                                </div>
                                <a href="#" class="small-box-footer">
                                    More info <i class="fa fa-arrow-circle-right"></i>
                                </a>
                            </div>
                        </div><!-- ./col -->
                        <div class="col-lg-3 col-xs-6">
                            <!-- small box -->
                            <div class="small-box bg-red">
                                <div class="inner">
                                    <h3>
                                        65
                                    </h3>
                                    <p>
                                        Unique Visitors
                                    </p>
                                </div>
                                <div class="icon">
                                    <i class="ion ion-pie-graph"></i>
                                </div>
                                <a href="#" class="small-box-footer">
                                    More info <i class="fa fa-arrow-circle-right"></i>
                                </a>
                            </div>
                        </div><!-- ./col -->
                    </div><!-- /.row -->
}
@section HellAd
{
  <div class="user-panel">
                        <div class="pull-left image">





                            <img src="../Content/AdminLTE/img/avatar3.png" class="img-circle" alt="User Image" />
                        </div>
                        <div class="pull-left info">
                            <p>Hello, @WebSecurity.CurrentUserName</p>

                            <a href="#"><i class="fa fa-circle text-success"></i> Online</a>
                        </div>
                    </div>


    }

@section flom{
  
                            <a href="#" class="dropdown-toggle"id="tweets"  data-toggle="dropdown">
                                <i class="glyphicon glyphicon-user"></i>
                             
                                <span id="namesAu"> <i class="caret"></i></span>
                                    
                            </a>
       

   
    }

  
@{
    var jTableStyle = "metro/blue/jtable.css";
    if (!string.IsNullOrEmpty(Request["jTableStyle"]))
    {
        jTableStyle = Request["jTableStyle"];
    }
}

<style>
    #DeleteAllButton {
        display:none;
    }
    #SelectedRowList {
        display: none;
    }
    #formaduser {
         display: none;
    }
</style>

<div id="tele">

</div>


    <link href="@Url.Content("~/Content/Jtable/Site.css")" rel="stylesheet" type="text/css" />
    <link href="@Url.Content("~/Content/Jtable/themes/metroblue/jquery-ui.css")" rel="stylesheet" type="text/css" />
    <link href="@Url.Content("~/Content/Jtable/highlight.css")" rel="stylesheet" type="text/css" />
    <link href="@Url.Content("~/Scripts/jtable/themes/" + jTableStyle)" rel="stylesheet" type="text/css" />

    

    <link href="@Url.Content("~/Scripts/syntaxhighligher/styles/shCore.css")" rel="stylesheet" type="text/css" />
    <link href="@Url.Content("~/Scripts/syntaxhighligher/styles/shThemeDefault.css")" rel="stylesheet" type="text/css" />
     <script src="@Url.Content("~/Scripts/modernizr-2.6.2.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/jquery-1.9.0.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/jquery-ui-1.9.2.min.js")" type="text/javascript"></script>

    <script src="@Url.Content("~/Scripts/syntaxhighligher/shCore.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/syntaxhighligher/shBrushJScript.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/syntaxhighligher/shBrushXml.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/syntaxhighligher/shBrushCSharp.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/syntaxhighligher/shBrushSql.js")" type="text/javascript"></script>

    <script src="@Url.Content("~/Scripts/jtablesite.js")" type="text/javascript"></script>
    <script type="text/javascript" src="@Url.Content("~/Scripts/jtable/jquery.jtable.js")"></script>
    

<div id="StudentTableContainer">
</div>

<!-- An area to show selected rows (for demonstration) -->
<br />
<button id="DeleteAllButton" class="btn btn-default btn-block">Delete All</button>
<br /> <br />
@*Selected rows (refreshed on <b>selectionChanged</b> event):*@
<div id="SelectedRowList">
     

   
</div>

<script type="text/javascript">

    $(document).ready(function () {
   
        $('#StudentTableContainer').jtable({
        
            title: 'Authors List',
       
            paging: true,
            sorting: true,
            defaultSorting: 'Name ASC',
            selecting: true, //Enable selecting
            multiselect: true, //Allow multiple selecting
            selectingCheckboxes: true, //Show checkboxes on first column
            defaultSorting: 'Name ASC',
            actions: {
                listAction:   '@Url.Action("AccountList")',
                deleteAction: '@Url.Action("DeleteAuthor")',
                updateAction: '@Url.Action("UpdateAuthor")'
             
            },
            fields: {
                Id: {
                    key: true,
                    create: false,
                    edit: false,
                    list: false
                },

                userPr: {
                    title: 'Login',
                    width: '13%'

                },
                Name: {
                    title: 'Name',
                    width: '10%'
                },

                Lastname: {
                    title: 'Lastname',
                    width: '10%'
                },
               
              
                Adressmail: {
                    title: 'Email',
                    width: '20%'
                },
               
              
              
                Profil: {
                    title: 'Profil',
                    width: '15%',
               
                    display: function (Data) {
                        //Create an image that will be used to open child table
                        var $img = $('<img src="/Content/images/arrow_down.png" style="" title="Sujets" />');
                      
                        //Open child table when user clicks the image
                   
                        $img.click(function () {
                            var user = Data.record.userPr
                          
                         
                            $('#StudentTableContainer').jtable('openChildTable',
                                    $img.closest('tr'),
                                    {
                                       
                                        title: Data.record.Profil + ' - Article Title  ',
                                        actions: {
                                            
                                            listAction: '/Account/Getroles?userid=' + Data.record.userPr,
                                            deleteAction: '/Account/DeleteRole?Username=' + user
                                         
                                        },

                                        fields: {
                                            Username: {
                                               title: 'User',
                                               width: '15%',
                                               list: false,
                                               defaultValue: Data.record.userPr
                                                  },
                                            RoleName: {
                                                key: true,
                                                title: 'Roles',
                                                width: '15%'
            }

                                           

                                        }
                                    }, function (data) { //opened handler
                                        data.childTable.jtable('load');
                                    });
                        });
                        //Return image to show on the person row
                        return $img;
                    }

                         }
               

            },

            //Register to selectionChanged event to hanlde events
           
            selectionChanged: function () {
               
              
              
                //Get all selected rows
                var $selectedRows = $('#StudentTableContainer').jtable('selectedRows');
           
                $('#SelectedRowList').empty();
                if ($selectedRows.length > 0) {
                    $("#DeleteAllButton").show();
                    $("#SelectedRowList").show();

                    //Show selected rows
                    var TabHtml = '<table class=table table-bordered><tr style="background-color: rgba(0, 0, 0, 0.1)"><th>#</th><th> Login  </th><th> Name  </th> <th>lastName </th> <th>Profil</th></tr>';
                    $selectedRows.each(function (index) {
                        var record = $(this).data('record');
                        // table table-bordered
                        console.log(record.userPr);
                        //$.each(record.userPr, function (index, obj) {

                        //    console.log(obj.userPr)
                        //});
                        $('#SelectedRowList').append($(TabHtml + '<tr style ><td >' + index + '</td><td>' + record.userPr +'</td><td>'+ record.Name + '</td><td>' + record.Lastname + '</td><td>' + record.Profil + '</td></tr></table>', {

                        }));

                        
                       
                    });
                } else {
                    //No rows selected
                    $('#SelectedRowList').append('No row selected! Select rows to see here...');
                    $("#DeleteAllButton").hide();
                    $("#SelectedRowList").hide();
                }
            }
        });

        //Load student list from server
        $('#StudentTableContainer').jtable('load');

        //Delete selected students
        $("#DeleteAllButton").button().click(function () {
            var $selectedRows = $('#StudentTableContainer').jtable('selectedRows');
            $('#StudentTableContainer').jtable('deleteRows', $selectedRows);
        });
    });

</script>

    
<button class="btn btn-primary" id="t">+</button>


<div id ="formaduser"> 


    <fieldset>
        <legend></legend>

            <div class="box box-primary">
                                <div class="box-header">
                                    <h3 class="box-title">Register An Account</h3>
                                </div><!-- /.box-header -->
                                <!-- form start -->
                                <form role="form">
                                    <div class="box-body">

                                          <div class="form-group">
                                            <label for="exampleInputEmail1">Login</label>
                                            <input type="text" class="form-control" id="Login" placeholder="Login">
                                        </div>

                                        <div class="form-group">
                                            <label for="exampleInputEmail1">Email address</label>
                                            <input type="email" class="form-control" id="exampleInputEmail1" placeholder="Enter email">
                                        </div>
                                        <div class="form-group">
                                            <label for="exampleInputPassword1">Password</label>
                                            <input type="password" class="form-control" id="InputPassword" placeholder="Password">
                                        </div>
                                  

                                         <div class="form-group">
                                            <label for="exampleInputPassword1">Password</label>
                                            <input type="password" class="form-control" id="ConfirmInputPassword" placeholder="Password">
                                        </div>

                                      
                                
                                       <div class="form-group">
                                            <label>Roles</label>
                                            <select id="takero"  class="form-control">
                                               
                                                    @foreach (var item in ViewBag.msg)
                                                    {
                                                          <option>@item</option> 
                                                    }
                                                    
                                                    
                                                
                                                
                                               
                                            </select>
                                        </div>
                                       
                                    </div><!-- /.box-body -->

                                    <div class="box-footer">
                                        <button type="submit"  id="btn_Ajax" class="btn btn-primary">Submit</button>
                                    </div>
                                </form>
                            </div>
      




       
    </fieldset>

  
    </div>
<div id="fethi">

       

</div>
<script src="~/Scripts/CustomAccountAdmJS/accountAdmin.js"></script>

@*<script>
    (function () {
        var authorForm = {
            
            
       
           
            Init: function (config) {
              
                this.containerF = config.containerForm;
                this.href = config.href;
                this.twt = config.twt;
                this.url = config.url;
                this.setUrl();
                 this.hideForm();
                 this.submitF();
                 this.GetName();
               
            },
            setUrl: function () {
              
                $('a#tweets').attr('href', this.url)
                

            },
            hideForm: function () {
                var $this=this;
                
                $('#t').on('click', function () {
              $($this.containerF).toggle(300);
                
                    console.log('bbk')
                });
            },
            submitF: function () {
                var $this = this;
                
               console.log($this)
               $("#btn_Ajax").on('click', function (index) {
                   debugger;
                var temp=  {
                    UserName: $("#Login").val(),
                    PassWord: $("#InputPassword").val(),
                    ConfirmPassWord: $("#ConfirmInputPassword").val(),
                    Roles: $("#takero option:selected").val(),
                    Mail: $('#exampleInputEmail1').val(),
                       }
                       console.log(temp);
               
                   
                    $.ajax({
                        url: '/Account/RegisterAuthor',
                        data:JSON.stringify(temp),
                        type: 'POST',
                        contentType: 'application/json; charset=utf-8',
                        success: function (data) {
                            var output;
                          console.log('hi there')


                        }
                    });
                    
                    //$.post("/Test/RegisterAuthor", temp, function (result) {
                    //    console.log(result);
                    //});
                });
            },
          
            GetName: function () {
                var $this = this;
                $.ajax({
                    url: '/Account/GetAuthorNames',
                    type: 'get',
                    dataType: 'json',
                    cache: false,
                    success: function (data) {
                     
               var auth= {   
                   authorname: data.results.Name,
                   authorlastname: data.results.Lastname
                        };
               $('<em>' + auth.authorname + ' ' + auth.authorlastname + '</em>', {

               }).insertAfter('.glyphicon');
             
               $this.twt.mouseenter(function () {
               

             
                   if ($(document).find('span.cop').length) return;
                 
                   $('<span class=cop>Déconnexion </span>')
                       .animate({
                           width: ["toggle", "swing"],
                           height: ["toggle", "swing"],
                           opacity: "toggle"
                       }, 5000)
                       .insertAfter($this.twt);

                   $('span.cop').toggle(3000);

               });

             
                    }
                });
            }
        }



        authorForm.Init({
            containerForm: $("#formaduser"),
             href : $('a#tweets').attr('href'),
             twt: $("#tweets"),
             url:"/Account/Login"
        });
    })();

</script>*@